

// 个人相册上面的四个按钮
const creatABbtn = document.getElementById("creatABbtn");
const upImgABbtn = document.getElementById("upImgABbtn");
const delImgABbtn = document.getElementById("delImgABbtn");
const lookABbtn = document.getElementById("lookABbtn");

// 获得查看所有相册
const lookAlbumBox = document.getElementsByClassName("lookABphotoBox")[0];

// 获得相册详细内容的盒子
const albumDetailBox = document.getElementsByClassName("lookABphotoDetail")[0];

window.userAlbumData = false;





// 相册封面
function htmlABcover(data){
    // 传进来的参数是每个相册
    if(data.pictureList){

        let str = `  <div class="everyAB">
        <ul class="ABinfo">
          <li class="ABtitle">《${data.title}》</li>
          <li class="ABid">相册ID:${data.albumId}</li>
          <li class="ABnum">图片数量:${data.pictureList.length}</li>
        </ul>
      </div>`;
      return str;
    }
    else{
        
        let str = `  <div class="everyAB">
        <ul class="ABinfo">
          <li class="ABtitle">《${data.title}》</li>
          <li class="ABid">相册ID:${data.albumId}</li>
          <li class="ABnum">图片数量:0</li>
        </ul>
      </div>`;
      return str;
    }
   
}

// 查看相册中的图片
function toAbDetail(album,albumId){
    let len = album.length;
    let str = '';

    for(let i = 0 ; i < len;i++){
        str += `<li> <img  src="${queryURL}${album[i].url}" alt=""><i class="fas fa-trash-alt delIco"></i> </li>`;
    }
    albumDetailBox.innerHTML = str;

    let delIco = document.querySelectorAll(".delIco");
    for(let i = 0 ; i<len;i++){
        delIco[i].onclick = function(){
            delImgInAB(albumId,album[i].url);
        }
    }
}

// 插入模板字符串得操作
function insertAbHtml(data){
    // 传进来的参数是所有相册

    let htmlAll = ''
    let len = data.length;
    lookAlbumBox.style.display = "flex";
    for(let i = 0 ; i < len ; i++){
        htmlAll += htmlABcover(data[i]);
    }
    lookAlbumBox.innerHTML = htmlAll;

    // 给每个相册的封面放相册的第一张图
    let everyAB = document.querySelectorAll(".everyAB");
    for(let i = 0 ; i<len ; i++){
        if(data[i].pictureList){
            everyAB[i].style.backgroundImage = `url(${queryURL}${data[i].pictureList[0].url})`;
            everyAB[i].onclick = function(){
                lookAlbumBox.style.display = "none"; 
                albumDetailBox.style.display = "flex";  
                toAbDetail(data[i].pictureList,data[i].albumId);        
            }
            
        }
       
    } 
}

// 查看相册
lookABbtn.onclick = function(){
    createAbBox.style.display = "none";
    albumDetailBox.style.display = "none"; 
    upABimgBox.style.display = "none"
    let urls = `album/oneAlbum?userId=` + window.userInfoG.data.id;
    pathGetData(urls).then(function(value){
        if(value.code == 40003){
            console.log(value);
        
            window.userAlbumData = value.data;
            insertAbHtml(value.data);
        }
        else{
            console.log(value.msg);
            lookAlbumBox.innerHTML=value.msg;
        }
            
        
        
    },function(reason){
        console.log("发送相册AJAX请求失败");
    })

}